<template>
  <div>
    <Dialog
      :show="dialogConfig.show"
      :title="dialogConfig.title"
      :buttons="dialogConfig.buttons"
      width="500px"
      :showCancel="false"
      @close="dialogConfig.show = false"
    >
      <el-form
        :model="formData"
        :rules="rules"
        ref="formDataRef"
        label-width="100px"
        @submit.prevent
      >
        <el-form-item
          label="发布人"
          size="normal"
        >
          <Avatar
            :userId="formData.userId"
            :width="40"
          ></Avatar>
          <span style="margin-left: 5px;">{{ formData.nickName }}</span>
        </el-form-item>
        <el-form-item
          label="文件名"
          size="normal"
        >
          <span>{{ formData.fileName }}</span>
        </el-form-item>
        <el-form-item
          label="大小"
          size="normal"
        >
          <span>{{ proxy.Utils.sizeToStr(formData.fileSize) }}</span>
        </el-form-item>
        <el-form-item
          label="下载所需积分"
          size="normal"
        >
          <span>{{ formData.integral }}</span>
        </el-form-item>
        <!--input输入-->
        <el-form-item
          label=""
          prop=""
        >
          <a
            :href="'/api/forum/attachmentDownload?fileId=' + formData.fileId"
            class="a-link"
            target="_blank"
          >下载</a>
        </el-form-item>
      </el-form>
    </Dialog>
  </div>
</template>

<script setup>
import { ref, reactive, getCurrentInstance, nextTick } from 'vue';
import { useRoute, useRouter } from 'vue-router';
const { proxy } = getCurrentInstance();
const route = useRoute();
const router = useRouter();
const formData = ref({});
const formDataRef = ref();
const rules = {
  title: [{ required: true, message: "请输入内容" }],
};

const dialogConfig = reactive({
  show: false,
  title: "查看附件",
  buttons: [
    {
      type: "danger",
      text: "关闭",
      click: (e) => {
        dialogConfig.show = false
      },
    },
  ],
});

const api = {
  getAttachment: '/forum/getAttachment'
}

const show = async (nickName, articleId) => {
  dialogConfig.show = true
  let result = await proxy.Request({
    url: api.getAttachment,
    params: {
      nickName: nickName,
      articleId: articleId
    }
  })
  if (!result) {
    return;
  }
  formData.value = result.data
}

defineExpose({ show })
</script>

<style lang="scss" scoped></style>
